import { View, Text, Image } from '@tarojs/components'
import { AtIcon } from 'taro-ui'
import cardImg from '@/assets/image/card-img.png'
import './index.less'

const imgs = [0, 1, 2]
const white = [0]

type propsType = {
    title: string,
    onClick?: () => void
}

function ClothesCard(props: propsType = { title: '', onClick: () => { } }) {
    return (
        <View className='clothes-card' onClick={() => props.onClick ? props.onClick() : {}}>
            <View className='at-row at-row__justify--between at-row__align--center title'>
                <Text>{props.title}</Text>
                <AtIcon value='menu' size='20' color='#5E6FFA'></AtIcon>
            </View>
            <View className='at-row at-row__justify--around'>
                {
                    imgs.map((_v, k) => {
                        return <Image key={k} src={cardImg} className='img' />
                    })
                }
                {
                    white.map((_v, k) => {
                        return <View key={k} className='img'></View>
                    })
                }
            </View>
        </View>
    )
}

export default ClothesCard